<template>
	<view class="editCharge">
		<uni-forms class="addForm" ref="baseForm" :modelValue="form" label-width="100">
			<uni-forms-item label="收费模式" required></uni-forms-item>
			<view class="chargeMode">
				<radio-group @change="changeCharge">
					<template v-for="(item, index) in chargeArr">
						<label class="uni-list-cell uni-list-cell-pd flex alignCenter font12" v-if="index<2" :key="index">
							<view class="">
								<radio :value="item.value" color="#F7DD5E" :checked="item.value === form.charge" style="transform:scale(0.7)"/>
							</view>
							<view class="">{{item.title}}</view>
						</label>
					</template>
					<template v-for="(item, index) in chargeArr">
						<label class="uni-list-cell uni-list-cell-pd flex alignCenter font12" v-if="index>=2" :key="index">
							<view class="">
								<radio :value="item.value" color="#F7DD5E" :checked="item.value === form.charge" style="transform:scale(0.7)"/>
							</view>
							<view class="">{{item.title}}</view>
							<view class="flex alignCenter" v-if="index==2">
								<input class="font14 bold priceInput" type="number" v-model.trim="form.amount">
								<text>元</text>
							</view>
							<label class="flex alignCenter">
								<checkbox-group @change="changeCheckBox">
									<checkbox color="#F7DD5E" class="font14" value="1" :checked="isTeam" style="transform:scale(0.7)" @change="changeCheckBox"/>
								</checkbox-group>
								<text>拼团</text>
							</label>
							<view class="flex alignCenter">
								<input class="font14 bold priceInput" type="number" maxlength="5" v-model="form.chargeCount" @focus="changeCheckBox('focus')">
								<text>人</text>
							</view>
							<view class="flex alignCenter">
								<input class="font14 bold priceInput" type="number" maxlength="3" v-model="form.chargeDiscount" @focus="changeCheckBox('focus')">
								<text>折</text>
							</view>
						</label>
					</template>
				</radio-group>
			</view>
		</uni-forms>
		<view class="noWidthBtn font14" @click="save">保存</view>
	</view>
</template>

<script>
	import { editGroupInfo } from "@/api/send.js"
	import { money } from "@/utils/verification.js"
	export default {
		data() {
			return {
				form:{
					charge:'0',
					amount:'',
					chargeCount:'',
					chargeDiscount:'',
				},
				isTeam:false,
				// 单选数据源
				chargeArr: [{
					title: '免费无需审核',
					value: '0'
				}, {
					title: '免费需要审核',
					value: '1'
				}, {
					title: '收费',
					value: '2'
				}],
				editId:''
			};
		},
		onLoad(option) {
			let query=option.query?JSON.parse(option.query):''
			this.form=query.form?query.form:''
			this.from=query.from?query.from:''
			this.editId=query.id?query.id:''
			console.log('form',JSON.parse(option.query))
		},
		methods:{
			// 更改收费模式
			changeCharge(e){
				console.log('val==',e)
				this.form.charge=e.detail.value
				if(this.form.charge<2){
					this.isTeam=false
					this.form.amount=''
					this.form.chargeCount=''
					this.form.chargeDiscount=''
					return
				}
			},
			changeCheckBox(e){
				if(e=='focus'){
					this.isTeam=true
				}else{
					this.isTeam=e.detail.value.length>0?true:false
				}
			},
			save(){
				if(this.form.charge==2 && !money.test(this.form.amount)){
					uni.showToast({
						title:'请输入费用',
						icon:'none'
					})
					return
				}else if(this.form.charge==2 && this.isTeam && !this.form.chargeCount){
					uni.showToast({
						title:'请输入拼团人数',
						icon:'none'
					})
					return
				}else if(this.form.charge==2 && this.isTeam && !this.form.chargeDiscount){
					uni.showToast({
						title:'请输入折扣',
						icon:'none'
					})
					return
				}
				uni.showLoading({
					title:'保存中',
					mask:true
				})
				let param={
					id:this.editId,
					amount:this.form.amount,
					charge:this.form.charge,
					chargeCount:this.form.chargeCount,
					chargeDiscount:this.form.chargeDiscount
				}
				console.log('param===',param)
				if(this.from=='group'){
					editGroupInfo(param).then((res)=>{
						uni.hideLoading()
						if(res.code==100000){
							uni.showToast({
								icon:'none',
								title:'修改成功'
							})
							setTimeout(()=>{
								uni.navigateBack({
									delta:1
								})
							},2000)
						}
					}).catch((err)=>{uni.hideLoading()})
					return
				}else{
					//TO DO
				}
				
			}
		}
	}
</script>
<style lang="scss" scoped>
@import "@/static/public.scss";
::v-deep .uni-forms-item__label{
	align-items: flex-start;
	height: auto;
	margin-right:20rpx;
}
.editCharge{
	padding: 30rpx;
	box-sizing: border-box;
}
.addForm{
	background: #fff;
	padding: 30rpx;
	box-sizing: border-box;
	border-radius: 8rpx;
	// box-shadow: 0 0 18rpx 0 rgba(0, 0, 0, .3);
}
.chargeMode{
	.priceInput{
		border:1px solid $bordercolor;
		width: 70rpx;
		padding: 0 10rpx;
		height:50rpx;
		line-height: 50rpx;
		box-sizing: border-box;
		border-radius: 8rpx;
		margin:0 10rpx 0 15rpx;
		text-align: center;
	}
	.uni-list-cell{
		margin:0 0 20rpx;
	}
	.uni-list-cell:last-child{
		margin:0;
	}
}
.noWidthBtn{
	width: 200rpx;
	margin: 100rpx auto 0;
}
</style>
